<template>
  <el-row type="flex" justify="center">
    <el-col :span="6" :offset="18">
      <el-form>
        <el-form-item>
          <span style="font-size:38px">欢迎回来</span>&nbsp;&nbsp;&nbsp;
          <span>
            <span>没有账号？</span>
            <router-link style="color: #409EFF;text-decoration:none;" to="/register">前往注册</router-link>
          </span>
        </el-form-item>
        <el-form-item>
          <el-input v-model="loginform.manageAccount" placeholder="请输入账号"></el-input>
        </el-form-item>
        <el-form-item>
          <el-input v-model="loginform.managePwd" show-password placeholder="请输入密码"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="login" type="primary" style="width: 40%; height:45px">登录</el-button>
          <el-button @click="FaceLogin" style="width: 55%;"><img src="../assets/face.png" width="20px" height="20px" style="line-height: 20px;" ><span style="font-size:25px">人脸识别登录</span></el-button>
        </el-form-item>
      </el-form>
    </el-col>
  </el-row>
</template>
      
      <script>
export default {
  data() {
    return {
      loginform: {
        manageAccount: "",
        managePwd: ""
      },
      token: "",
    };
  },
  methods: {
    FaceLogin(){
      this.$router.push({
         path: "/FaceLogin"
         });
    },
    login() {
      if (!this.loginform.manageAccount || !this.loginform.managePwd) {
        this.$message.error("请完整填写登录信息");
        return;
      }
      this.$axios.post("api/uums-server/login", this.loginform).then(res => {
        console.log(res.data);
        if (res.data.code == 200) {
          localStorage.setItem("token", res.data.data);
          this.token = res.data.data;
          this.$router.push({ path: "/" });
        }else {
          this.$message.error("账号或密码错误");
        }
      });
    }
  }
};
</script>
<style scoped>
    .el-row {
    /* background: darkslategray; */
    background-image: url("../assets/loginbac.jpg");
    background-size: cover;
    height: 100%;
    }
    .el-col {
    background: white;
    padding: 15% 20px;
    border-radius: 2px; /*加圆角 */
    }
    .el-input {
    margin: 8px 1px;
    }
</style>
      